<div class="grid">
    <div class="col-12">
        <div class="card">
            <div class="card-w-title">
                <h5 style="font-weight: 900">定时任务</h5>
            </div>
            <p-toolbar>
                <div
                    class="p-toolbar-group-left flex flex-wrap formgroup-inline"
                ></div>

                <div class="p-toolbar-group-right formgroup-inline">
                    <div class="field">
                        <button
                            pButton
                            type="button"
                            label="新增定时任务"
                            icon="pi pi-plus"
                            class="mr-2"
                            (click)="openDialog()"
                        ></button>
                    </div>
                </div>
            </p-toolbar>
        </div>
    </div>
    <div class="col-12">
        <div class="card" style="min-height:625px">
            <p-table
                #dt1
                [value]="data"
                dataKey="wellCode"
                [rowHover]="true"
                [rows]="10"
                [paginator]="true"
                [rowsPerPageOptions]="[10, 25, 50]"
                scrollDirection="both"
                [scrollable]="true"
                styleClass="p-datatable-striped"
                responsiveLayout="scroll"
            >
                <ng-template pTemplate="header">
                    <tr>
                        <th width="120">
                            <div
                                class="flex justify-content-between align-items-center"
                            >
                                任务名称
                            </div>
                        </th>
                        <th width="150">
                            <div
                                class="flex justify-content-between align-items-center"
                            >
                                任务状态
                            </div>
                        </th>
                        <th width="200">
                            <div
                                class="flex justify-content-between align-items-center"
                            >
                                任务分组
                            </div>
                        </th>
                        <th width="150">
                            <div
                                class="flex justify-content-between align-items-center"
                            >
                                任务描述
                            </div>
                        </th>
                        <th width="200">
                            <div
                                class="flex justify-content-between align-items-center"
                            >
                                cron表达式
                            </div>
                        </th>
                        <th width="300">
                            <div
                                class="flex justify-content-between align-items-center"
                            >
                                调用类名
                            </div>
                        </th>
                        <th width="150">
                            <div
                                class="flex justify-content-between align-items-center"
                            >
                                创建人
                            </div>
                        </th>
                        <th width="150">
                            <div
                                class="flex justify-content-between align-items-center"
                            >
                                创建时间
                            </div>
                        </th>
                        、
                        <th width="150">
                            <div
                                class="flex justify-content-between align-items-center"
                            >
                                修改人
                            </div>
                        </th>
                        <th width="150">
                            <div
                                class="flex justify-content-between align-items-center"
                            >
                                修改时间
                            </div>
                        </th>
                        <th width="500" pFrozenColumn alignFrozen="right">
                            <div
                                class="flex justify-content-between align-items-center"
                            >
                                操作
                            </div>
                        </th>
                    </tr>
                </ng-template>
                <ng-template pTemplate="body" let-item>
                    <tr>
                        <td width="120">
                            {{ item.jobName }}
                        </td>
                        <td width="150">
                            {{ ["结束", "运行"][item.jobStatus] }}
                        </td>
                        <td width="200">
                            {{ item.jobGroup }}
                        </td>
                        <td width="150">
                            {{ item.jobDescription }}
                        </td>
                        <td width="200">
                            {{ item.cronExpression }}
                        </td>
                        <td width="300" style="word-break: break-all">
                            {{ item.beanClass }}
                        </td>
                        <td width="150">
                            {{ item.createUser }}
                        </td>
                        <td width="150">
                            {{ item.createTime }}
                        </td>
                        <td width="150">
                            {{ item.updateUser }}
                        </td>
                        <td width="150">
                            {{ item.updateTime }}
                        </td>
                        <td
                            width="500"
                            style="text-align: center"
                            pFrozenColumn
                            alignFrozen="right"
                        >
                            <button
                                pButton
                                pRipple
                                type="button"
                                label="修改cron表达式"
                                class="p-button-secondary"
                                style="margin-left: 20px"
                                (click)="openDialog1(item)"
                            ></button>
                            <button
                                pButton
                                pRipple
                                type="button"
                                label="详情"
                                style="margin-left: 20px"
                                (click)="openDialog2(item)"
                            ></button>
                            <button
                                pButton
                                pRipple
                                type="button"
                                label="启用"
                                class="p-button-success"
                                style="margin-left: 20px"
                                *ngIf="item.jobStatus == 0"
                                (click)="changeState(item)"
                            ></button>
                            <button
                                pButton
                                pRipple
                                type="button"
                                label="停用"
                                class="p-button-warning"
                                style="margin-left: 20px"
                                *ngIf="item.jobStatus == 1"
                                (click)="changeState(item)"
                            ></button>
                            <button
                                pButton
                                pRipple
                                type="button"
                                label="删除"
                                class="p-button-danger"
                                style="margin-left: 20px"
                                (click)="deleteTask(item)"
                            ></button>
                        </td>
                    </tr>
                </ng-template>
                <ng-template pTemplate="emptymessage">
                    <tr>
                        <td colspan="7">没有找到定时任务信息</td>
                    </tr>
                </ng-template>
                <ng-template pTemplate="loadingbody">
                    <tr>
                        <td colspan="7">正在加载定时任务信息，请稍等</td>
                    </tr>
                </ng-template>
            </p-table>
        </div>
    </div>
</div>
<p-dialog
    [header]="editTag?'修改定时任务':'新增定时任务'"
    [(visible)]="display"
    [modal]="true"
    [style]="{ width: '600px',height:'800px'}"
    [draggable]="false"
    [resizable]="false"
>
    <div class="field grid">
        <label class="col-fixed w-9rem">任务名称</label>
        <div class="col">
            <input
                type="text"
                pInputText
                [(ngModel)]="addForm.jobName"
            />
        </div>
    </div>
    <div class="field grid">
        <label class="col-fixed w-9rem">任务状态</label>
        <div class="col">
            <!--input
                type="text"
                [(ngModel)]="addForm.jobStatus"
                pInputText
                label="email"
                class="ng-dirty ng-invalid mr-2"
            /-->
            <p-dropdown
                [options]="status"
                [(ngModel)]="addForm.jobStatus"
                optionLabel="label"
                optionValue="value"
                placeholder="选择任务状态"
            ></p-dropdown>
        </div>
    </div>
    <div class="field grid">
        <label class="col-fixed w-9rem">任务分组</label>
        <div class="col">
            <input
                type="text"
                [(ngModel)]="addForm.jobGroup"
                pInputText
            />
        </div>
    </div>
    <div class="field grid">
        <label class="col-fixed w-9rem">任务描述 </label>
        <div class="col">
            <input
                type="text"
                [(ngModel)]="addForm.jobDescription"
                pInputText
            />
        </div>
    </div>
    <div class="field grid">
        <label class="col-fixed w-9rem">cron表达式</label>
        <div class="col">
            <input
                type="text"
                [(ngModel)]="addForm.cronExpression"
                pInputText
            />
        </div>
    </div>
    <div class="field grid">
        <label class="col-fixed w-9rem">调用包名</label>
        <div class="col">
            <input
                type="text"
                [(ngModel)]="addForm.beanClass"
                pInputText
            />
        </div>
    </div>
    <div class="field grid">
        <label class="col-fixed w-9rem">创建人</label>
        <div class="col">
            <input
                type="text"
                [(ngModel)]="addForm.createUser"
                pInputText
            />
        </div>
    </div>
    <div class="field grid">
        <label class="col-fixed w-9rem">修改人</label>
        <div class="col">
            <input
                type="text"
                [(ngModel)]="addForm.updateUser"
                pInputText
            />
        </div>
    </div>
    <div class="field grid" style="margin-top: 4em;">
        <label class="col-fixed w-9rem">创建时间</label>
        <div class="col">
            <!--input
                type="text"
                
                pInputText
                label="email"
                class="ng-dirty ng-invalid mr-2"
            /-->
            <p-calendar [(ngModel)]="addForm.createTime" [showTime]="true" [showSeconds]="true" dateFormat="yy年mm月dd日"></p-calendar>
        </div>
    </div>
    <div class="field grid">
        <label  class="col-fixed w-9rem">修改时间</label>
        <div class="col">
            <!--input
                type="text"
                
                pInputText
                label="email"
                class="ng-dirty ng-invalid mr-2"
            /-->
            <p-calendar [(ngModel)]="addForm.updateTime" [showTime]="true" [showSeconds]="true" dateFormat="yy年mm月dd日"></p-calendar>
        </div>
    </div>
    <ng-template pTemplate="footer">
        <p-button
            (click)="submit()"
            label="保存"
            styleClass="p-button-text"
        ></p-button>
        <p-button
            (click)="display = false"
            label="取消"
            styleClass="p-button-text"
        ></p-button>
    </ng-template>
</p-dialog>
<p-dialog
    [header]="'修改cron表达式'"
    [(visible)]="display1"
    [modal]="true"
    [style]="{ width: '600px' }"
    [draggable]="false"
    [resizable]="false"
>
    <div class="field grid">
        <label for="email" class="col-fixed w-9rem">表达式</label>
        <div class="col">
            <input
                type="text"
                [(ngModel)]="cronForm.cron"
                pInputText
                label="email"
            />
        </div>
    </div>
    <ng-template pTemplate="footer">
        <p-button
            (click)="editCron()"
            label="保存"
            styleClass="p-button-text"
        ></p-button>
        <p-button
            (click)="display1 = false"
            label="取消"
            styleClass="p-button-text"
        ></p-button>
    </ng-template>
</p-dialog>
<p-confirmDialog [style]="{ width: '450px' }"></p-confirmDialog>
<p-toast></p-toast>
